<template>
	<view>
		<!-- 页面内容写在这里 -->
		<view>
			
		</view>
	
		<!-- 加载更多组件 -->
		<up-loadmore v-if="!emptyProp.show" :status="loadMoreProp.status" :loading-text="loadMoreProp.loadingText"
			:loadmore-text="loadMoreProp.loadmoreText" :nomore-text="loadMoreProp.nomoreText" line>
		</up-loadmore>
		<!-- 数组为空组件 -->
		<up-empty :show="emptyProp.show" marginTop="50px"></up-empty>
		<!-- 消息提示组件 -->
		<up-toast ref="toastRef"></up-toast>
	</view>
</template>

<script lang="ts" setup>
	import { onLoad, onPullDownRefresh, onReachBottom } from '@dcloudio/uni-app';
	import { reactive, ref } from 'vue';
	import { useUserStore } from '@/store';
	import { pages } from '@/utils/page-url';
	import { getFilesByJsonStr } from '@/utils';

	// 用户store
	const userStore = useUserStore();
	
	const toastRef = ref();
	
	const dataForm = ref({});
	const dataList = ref([]);
	const dataListTotal = ref(0);

	const queryParams = reactive({
		pageNumber: 1,
		pageSize: 10,
	});
	
	// 加载更多属性
	const loadMoreProp = reactive({
		status: 'loadmore',
		loadingText: '努力加载中，先喝杯茶',
		loadmoreText: '轻轻上拉获取更多数据',
		nomoreText: '没得数据咯'
	});

	// 空数据属性
	const emptyProp = reactive({
		show: false
	});
	
	// 重置搜索参数
	const resetQueryParams = async () => {
		queryParams.pageNumber = 1;
		queryParams.pageSize = 10;
	}
	
	// 重置数据列表
	const resetData = async () => {
		dataList.value = [];
		dataListTotal.value = 0;
	}
	
	// 设置分页数据
	const setPage = () => {
		// 判断列表总数
		if (dataList.value.length === dataListTotal.value) {
			loadMoreProp.status = 'nomore';
		} else {
			loadMoreProp.status = 'loadmore';
		}
		emptyProp.show = dataList.value.length === 0;
		
	}
	
	// 获取数据
	const getData = async (
		params = JSON.parse(JSON.stringify(queryParams))
	) => {
		// 获取数据
		const { code, msg, data }:any = await new Promise(() => {});
		if (code === 200) {
			queryParams.pageNumber = data.pageNumber;
			dataListTotal.value = data.total;
			const rows = data.rows;
			if (dataList.value.length < data.total) {
				dataList.value.push(...rows);
			} else {
				// 页码减1
				queryParams.pageNumber -= 1;
			}
		} else {
			toastRef.value.show({
				type: 'default',
				message: msg,
				duration: 1500,
				position: 'top'
			})
		}
	}

	onLoad(async (prop:AnyObject) => {
		console.warn('页面传参prop', prop)
		setPage();
		// 获取数据
		await getData();
		setPage();
	});

	// 下拉刷新
	onPullDownRefresh(async () => {
		await resetQueryParams();
		await resetData();
		// 获取数据
		await getData();
		setPage();
		// 停止下拉
		uni.stopPullDownRefresh();
	});

	// 上拉加载
	onReachBottom(async () => {
		if (loadMoreProp.status === 'loadmore') {
			loadMoreProp.status = 'loading';
			queryParams.pageNumber += 1;
			// 获取数据
			await getData();
			setPage();
		}
	});
</script>

<style lang="scss">
</style>

<style lang="scss" scoped>
</style>
